<template>
  <view class="universal-detail">
    <view class="universal-detail-top">
      <view class="universal-detail-top-time"><text class="universal-detail-top-title">维修处理</text> {{ model.repairTime || '-'}}</view>
      <view class="universal-detail-top-username">处理人：{{ model.repairPersonName || '-' }}</view>
    </view>
    <view class="universal-detail-cont">
      <view class="universal-detail-item">
        <view class="universal-detail-item-title">处理方式及结果：</view>
        <view class="universal-detail-item-cont">{{ model.repairResult || '-' }}</view>
      </view>
      <view class="universal-detail-item">
        <view class="universal-detail-item-title">处理照片：</view>
        <view class="universal-detail-list">
          <image v-for="(image, index) in model.convertFinishPic" :src="image.url" mode="aspectFit" @click="handleImagePreview(image.url, index)" class="universal-detail-list-image"></image>
        </view>
      </view>
      <view class="universal-detail-item">
        <view class="universal-detail-item-title">处理视频：</view>
        <view class="universal-detail-list">
          <video-preview v-for="(image, index) in model.convertFinishVideo" :src="image.url"></video-preview>
		      <view v-if="!model.convertFinishVideo?.length">-</view>
        </view>
      </view>
      <view class="universal-detail-item">
        <view class="universal-detail-item-title">完成时间：</view>
        <view class="universal-detail-item-cont">{{ model.finishTime || '-' }}</view>
      </view>
    </view>
  </view>
</template>

<script setup>
  import { ref } from 'vue';
  import { showImagePreview } from 'vant';
  const model = defineModel();
  const videoUrl = ref('');

  const handleImagePreview = (imageUrl, index) => {
    showImagePreview({
      images: [imageUrl],
      startPosition: index,
      closeOnClickImage: false,
    })
  }
  const handleVideoPreview = (url) => {
    videoUrl.value = url;
    show.value = true;
  }
</script>

<style lang="scss" scoped>
@import '@/assets/universal-detail.scss';
</style>